<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="标段" :labelCol="labelCol" :wrapperCol="wrapperCol">
              {{model.bidSectionName}}
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="评审活动" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="reviewActivity">
              <a-table id="table"  rowkey="id" :dataSource="activityList" :columns="columns" :pagination="false">
                <template slot="name" slot-scope="text, record,index">
                  <a-icon type="appstore-o" />
                  {{text}}
                  <a-tag v-if="record.type == 1">评分标准</a-tag>
                  <a-tag v-else>符合性审查项</a-tag>
                </template>
                <template slot="index" slot-scope="text, index, record">
                  {{record + 1}}
                </template>
              </a-table>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="定标方案类别" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="schemeCategory">
              <j-dict-select-tag type="list" v-model="model.schemeCategory" dictCode="scheme_category" placeholder="请选择定标方案类别" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <span slot="label">
                中标人数量
              </span>
              <a-input-number v-model="model.bidderNumber" placeholder="请输入中标人数量" style="width: 100%" />
              <a-row style="color:red">（中标人数量不是中标候选人数量！）</a-row>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="定标原则（500字以内）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="calibrationReason">
              <a-input v-model="model.calibrationReason" placeholder="请输入定标原则" type="textarea"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="符合性检查的评判原则" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="judgeePrinciple">
              <a-radio-group v-model="model.judgeePrinciple">
                <a-row>
                  <a-radio :value="0">全数通过</a-radio>
                  <a-radio :value="1">简单多数</a-radio>
                </a-row>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="本项目采用暗标的方式组织" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="sealedBidFlag">
              <a-switch v-model="model.sealedBidFlag"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="是否分步开标" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="stepFlag">
              <a-radio-group v-model="model.stepFlag">
                <a-row>
                  <a-radio :value="0">一次开标</a-radio>
                  <a-radio :value="1">分步开标</a-radio>
                </a-row>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="评委品分类别" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <div>
                <a-row>
                  综合专家
                  <a-checkbox-group v-model="model.comprehensiveExpert">
                    <a-checkbox value="1">技术 项评分</a-checkbox>
                    <a-checkbox value="2">综合 项评分</a-checkbox>
                  </a-checkbox-group>
                </a-row>
                <a-row>
                  技术专家
                  <a-checkbox-group v-model="model.technicalExpert">
                    <a-checkbox value="1">技术 项评分</a-checkbox>
                    <a-checkbox value="2">综合 项评分</a-checkbox>
                  </a-checkbox-group>
                </a-row>
                <a-row>
                  业主专家
                  <a-checkbox-group v-model="model.ownerExpert">
                    <a-checkbox value="1">技术 项评分</a-checkbox>
                    <a-checkbox value="2">综合 项评分</a-checkbox>
                  </a-checkbox-group>
                </a-row>
              </div>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { httpAction, getAction,postAction } from '@api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  import Sortable from 'sortablejs';

  export default {
    name: 'ExZbwjBidEvaluationConfigForm',
    components: {
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        model:{
         },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 15 },
        },
        confirmLoading: false,
        validatorRules: {
           projectId: [
              { required: true, message: '请输入项目id!'},
           ],
           bidSectionId: [
              { required: true, message: '请输入标段ID!'},
           ],
          schemeCategory: [
            { required: true, message: '请选择定标方案类别' }
          ],
          bidderNumber: [
            { required: true, message: '请输入中标人数量' }
          ],
          judgeePrinciple: [
            { required: true, message: '请选择符合性检查的评判原则' }
          ],
          stepFlag: [
            { required: true, message: '请选择是否分步开标' }
          ],
        },
        url: {
          add: "/ExZbwjBidEvaluationConfig/exZbwjBidEvaluationConfig/add",
          edit: "/ExZbwjBidEvaluationConfig/exZbwjBidEvaluationConfig/edit",
          queryById: "/ExZbwjBidEvaluationConfig/exZbwjBidEvaluationConfig/queryById"
        },
        activityList:[],
        columns: [
          {
            title: '排序',
            dataIndex: 'index',
            scopedSlots: { customRender: 'index'}
          },
          {
            title: '名称',
            dataIndex: 'name',
            scopedSlots: { customRender: 'name'}
          },
        ],
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      add () {
        this.edit(this.modelDefault);
        this.loadActivity();
        this.$nextTick(() => {
          this.initDrag()
        })
      },
      edit (record) {
        this.model = Object.assign({}, record);
        this.visible = true;
        this.loadActivity();
        this.$nextTick(() => {
          this.initDrag()
        })
      },

      submitForm () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl += this.url.edit
              method = 'put'
            }
            let params = JSON.parse(JSON.stringify(this.model))
            params.comprehensiveExpert = (params.comprehensiveExpert || []).join(',')
            params.technicalExpert = (params.technicalExpert || []).join(',')
            params.ownerExpert = (params.ownerExpert || []).join(',')
            params.itemList = this.activityList;
            params.sealedBidFlag = params.sealedBidFlag ? true : false;
            params.stepFlag = params.stepFlag ? true : false
            httpAction(httpurl, params, method).then((res) => {
              if (res.success) {
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            })
          }

        })
      },
      // 加载评审活动
      loadActivity () {
        let params = {
          pageNo: 1,
          pageSize: 100,
          projectId:this.model.projectId
        };
        Promise.all([
          getAction('/exScoreStandard/exScoreStandard/list',params),
          getAction('/exTenderFile/exZbwjConformanceReview/list',params),
        ]).then((res) => {
          let standardList = res[0].result.records
          let exZbwjConformanceReviewList = res[1].result.records
          let list = []
          standardList.forEach(e => {
            if(!e.bidSectionIds.includes(this.model.bidSectionId)){
              return
            }
            let index = list.length
            if (this.model.itemList && this.model.itemList.length > 0) {
              let find = this.model.itemList.find(find => find.type == 1 && find.businessId == e.id)
              console.log(find)
              if (find) {
                index = find.index
              }
            }
            let item = {}
            item.key = index + '_' + e.id
            item.name = e.name
            item.businessId = e.id
            item.type = 1
            item.index = index
            list.push(item)
          })
          exZbwjConformanceReviewList.forEach(e => {
            if(!e.bidSectionIds.includes(this.model.bidSectionId)){
              return
            }
            let item = {}
            let index = list.length
            if (this.model.itemList && this.model.itemList.length > 0) {
              let find = this.model.itemList.find(find => find.type == 2 && find.businessId == e.id)
              if (find) {
                index = find.index
              }
            }
            item.key = index + '_' + e.id
            item.name = e.name
            item.businessId = e.id
            item.type = 2
            item.index = index
            list.push(item)
          })
          list.sort(function(a, b) {
            return a.index - b.index;
          });
          this.activityList = list
        });
      },
      initDrag () {
        let that = this;
        let tbody = document.querySelector('#table tbody')
        new Sortable(tbody, {
          animation: 150,
          // 拖拽时预览图样式
          ghostClass: 'blue-background-class',
          onEnd ({ newIndex, oldIndex }) {
            if (newIndex == oldIndex) {
              return
            }
            that.moveTableData(oldIndex, newIndex)
          }
        })
      },

      //移动表格数据
      moveTableData (oldIndex, newIndex) {
        const currRow = this.activityList.splice(oldIndex, 1)[0]
        this.activityList.splice(newIndex, 0, currRow)
      }

    }
  }
</script>
<style>
.smart-ghost-class {
  background-color: #ccffff;
}

</style>
